<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.96/Build/Cesium/Cesium.js"></script>
    <link href="https://cesium.com/downloads/cesiumjs/releases/1.96/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <style>
        body{
            margin:0;
        }
        #cesiumContainer {
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
<div id="cesiumContainer">
</div>
<div id="vueContainer">
</div>
<template id="content">
    <p style="position:absolute; top: 0">
        <button @click="test" style="padding:8px 12px;">按钮</button>
        <button @click="measures" style="padding:8px 12px;">面积</button>
        <button @click="measures1" style="padding:8px 12px;">多选线</button>
        <button @click="measures2" style="padding:8px 12px;">角度</button>
        <button @click="measures3" style="padding:8px 12px;">直线</button>
        <button @click="startDrag1" style="padding:8px 12px;">编辑</button>
        <button @click="deletes" style="padding:8px 12px;">删除</button>
        <button @click="section" style="padding:8px 12px;">创建剖切</button>
        <button @click="section1" style="padding:8px 12px;">销毁剖切</button>
        <button @click="setmodelHeightTest" style="padding:8px 12px;">设置模型高度</button>
        <button @click="getModelPositionTest" style="padding:8px 12px;">模型位置信息</button>
        <button @click="createAFlatSectionTest" style="padding:8px 12px;">平剖</button>
    </p>
    </div>
</template>
<script src="Source/mian/SDK/variable/global_variable.js"></script>
<script src="Source/mian/SDK/install/install.js"></script>
<script src="Source/mian/SDK/function/measure/measure.js"></script>
<script src="Source/mian/SDK/function/section/section.js"></script>
<script src="Source/mian/SDK/function/shareFunction/shareFunction.js"></script>
<script src="Source/mian/SDK/function/modelHeightSeting/modelHeightSetting.js"></script>
<script>
    const {createApp,ref,onMounted,onBeforeUnmount} = Vue
    const app = createApp({
        template: `#content`,
        setup() {
            const message = ref('Hello Vue.js!')
            /**
             * 测试方法
             */
            const test = () => {
                console.log('测试')
            }
            const measures = () => {
                createMeasures("Polygon")
            }
            const measures1 = () => {
                createMeasures("Polyline")
            }
            const measures3 = () => {
                createMeasures("Line")
            }
            const deletes = () => {
                clearAllDrawn()
            }
            const section = () => {
                createSection()
            }
            const section1 = () => {
                deleteSection()
            }
            const startDrag1 = () => {
                startDrag()
            }
            const measures2 = () => {
                createMeasures("Angle")
            }
            const createAFlatSectionTest=()=>{
                createAFlatSection(10)
            }
            const setmodelHeightTest = () => {
                console.log('开始设置模型高度：', recordTilesetData)
                for (let key of recordTilesetData.keys()) {
                    console.log('查看tilter信息：', key)
                    setModelHeight(30,recordTilesetData.get(key))
                }
            }
            const getModelPositionTest = () => {
                getModelPosition()
            }
            //挂载完成执行的程序
            onMounted(()=>{
                console.log(1111111)

            })
            //销毁组件
            onBeforeUnmount(()=>{
                // vue程序销毁时，需要清理相关资源
                console.log(22222)
            })
            return {
                message,
                test,
                measures,
                measures1,
                section,
                section1,startDrag1,measures2,measures3,deletes,setmodelHeightTest,getModelPositionTest,createAFlatSectionTest
            }
        }
    })
    app.mount('#vueContainer')
</script>
</body>
</html>
